<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>首页</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/main.css">
    <link rel="stylesheet" href="../../css/vant.css">
    <!-- 引入样式 -->
</head>

<body>
    <div class="app" v-cloak>
        <div class="rongzibaoxian" v-if="listInsurance && listInsurance.length>0">
            <div class="main">
                <div class="item" v-for="insure in listInsurance" :key="insure.id" @click="openPage(insure)">
                    <img v-lazy="insure.imageUrl" alt="" />
                </div>
            </div>
            <div class="no-more" v-if="!hasNext">没有更多了</div>
        </div>
        <div class="collect-empty" v-else>
            <div class="collect-empty" >
            <img src="https://zzzzkj.oss-cn-shanghai.aliyuncs.com/static/tiexie/app/image/image/empty/empty.png" alt="">
            <div>暂无数据～</div>
        </div>
    </div>

    </div>

    </div>
    <script src="../../script/flexible.js "></script>
    <script src="../../script/fastclick.js "></script>
    <script src="../../script/vue.min.js "></script>
    <script src="../../script/iconfont.js "></script>
    <script src="../../script/vant.min.js"></script>
    <script src="../../script/api.js "></script>
    <script src="../../script/common.js "></script>
    <script src="../../script/businessCommon.js "></script>
    <script src="../../script/restful.js "></script>
    <script src="../../script/vue-lazyload.js"></script>

    <script>
        apiready = function() {
            imgLazyLoad();
            var vm = new Vue({
                el: '.app',
                data() {
                    var queryInfo = {
                        ids: [],
                        location: "0,0",
                        pageNum: 1,
                        pageSize: 10,
                        status: 1,
                        hasNext:false
                    }
                    var listInsurance = []
                    return {
                        listInsurance,
                        queryInfo
                    }
                },
                created() {
                    this.getInsuranceList();
                },
                conponents: {

                },
                methods: {
                    getInsuranceList() {
                        index.mergeInsure("getInsuranceList")(this.queryInfo, function(ret) {
                            if (vm.queryInfo.pageNum == 1) {
                                vm.listInsurance = []
                                vm.listInsurance = ret.data.list;
                            } else {
                                vm.listInsurance = vm.listInsurance.concat(ret.data.list);
                            }
                            vm.hasNext = ret.data.hasNext
                        })
                    },
                    openPage(item) {
                        api.openWin({
                            name: 'financinginsurance_detail_win',
                            url: 'financinginsurance_detail_win.html',
                            bounces: false,
                            pageParam: {
                                item: item
                            }
                        });
                    }
                },
            })
            api.setRefreshHeaderInfo({
                bgColor: '#f7f7f7',
                textDown: '下拉更新有惊喜',
                textUp: '松开可以刷新'
            }, function(ret, err) {
                //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
                vm.queryInfo.pageNum = 1;
                vm.getInsuranceList();
            });
            // 上拉加载
            api.addEventListener({
                name: 'scrolltobottom',
                extra: {
                    threshold: -10
                }
            }, function(ret, err) {
                console.log('上拉加载')
                if (vm.hasNext) {
                    vm.queryInfo.pageNum++
                    vm.getInsuranceList();
                }
            });
        }
    </script>
</body>

</html>
